Ext.namespace("ca.magex.gps");

ca.magex.gps.GpsTrailsPanel = function(config) {
	
	var t = this;
	Ext.apply(this, config);

	var ds = new ca.magex.data.TaggerStore({
		type: 'gps_segment',
		fields: [
			{name: 'title', mapping: '@title'},
			{name: 'tags', mapping: '@tags'},
			{name: 'visibility', mapping: '@visibility'},
			{name: 'pointquery', mapping: 'meta[@name="gps.pointquery"]/@value'}
		]
	});
	
    var tpl = new Ext.XTemplate(
		'<tpl for=".">',
		    '<div class="map-wrapper">',
		    '<span class="map-title">{title}</span>',
		    '<span class="map-tags">{tags}</span>',
		    '<span class="map-pointquery">{pointquery}</span>',
		    '</div>',
        '</tpl>',
        '<div class="x-clear"></div>'
	);

    ca.magex.gps.GpsTrailsPanel.superclass.constructor.call(this, {
    	title: 'Maps',
    	id: 'map-view',
	    store: ds,
	    tpl: tpl,
	    multiSelect: false,
	    overClass: 'x-view-over',
	    itemSelector: 'div.map-wrapper',
	    emptyText: 'No images to display',
	    listeners: {
    		click: function(view, index){
    			var pointquery = ds.getAt(index).get("pointquery");
				Ext.getCmp('map-panel').load(pointquery);
    		}
    	}
    });
    
};

Ext.extend(ca.magex.gps.GpsTrailsPanel, Ext.DataView);
